<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="./css/partthree-less/SpecialMall.css">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>特产商城</title>
</head>
<body>
<div class="container">
    <!--创建顶部容器-->
    <header class="header">
        <a href="#">
            <p>
                <img class="one" src="./imgs/partthree-imgs/ActivityDetails-imgs/lnav.png" alt="">
                特产商城
            </p>
            <img class="two" src="./imgs/partthree-imgs/ActivityDetails-imgs/rnav.png" alt="">
        </a>
    </header>
    <!--创建中部容器-->
    <section class="section">
        <!--创建搜索栏容器-->
        <div class="search-bar">
            <div class="search">
                <div class="left">
                旅游线路
                <div class="tri"></div>
                <div class="line"></div>
                <input type="text" placeholder="请输入关键字...">
                </div>
                <img src="./imgs/partthree-imgs/SpecialMall-imgs/ss.png" alt="">
            </div>
        </div>
        <!--创建图片容器-->
        <div class="banner">
            <img src="./imgs/partthree-imgs/SpecialMall-imgs/mallbg.png" alt="">
        </div>
        <!--创建“公益广告”容器-->
        <div class="ad-bar">
            <div class="ad">
                <div class="left">
            <img src="./imgs/partthree-imgs/SpecialMall-imgs/gy.png" alt="">
                    公益广告
                </div>
                <div class="right">
      <span>“江二娃”</span>购买特产商品向公益基金捐<span>5</span>元&nbsp;&nbsp;15:25
                </div>
            </div>
        </div>
        <!--创建导航容器-->
        <div class="nav-bar">
            <div class="nav">
            <ul class="list">
                <li class="item">
                    <a href="redline_index.html">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/hs.png" alt="">
                        <p>红色线路</p>
                    </a>
                </li>
                <li class="item">
                    <a href="#">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/dz.png" alt="">
                        <p>党政学习</p>
                    </a>
                </li>
                <li class="item">
                    <a href="#">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/ly.png" alt="">
                        <p>公益旅游</p>
                    </a>
                </li>
                <li class="item">
                    <a href="#">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/ky.png" alt="">
                        <p>旅游康养</p>
                    </a>
                </li>
            </ul>
            <ul class="list active">
                <li class="item">
                    <a href="productList.html">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/tt.png" alt="">
                        <p>土特产</p>
                    </a>
                </li>
                <li class="item">
                    <a href="#">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/cp.png" alt="">
                        <p>农副产品</p>
                    </a>
                </li>
                <li class="item">
                    <a href="ActivityNews.html">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/gg.png" alt="">
                        <p>活动公告</p>
                    </a>
                </li>
                <li class="item">
                    <a href="fund.html">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/jj.png" alt="">
                        <p>公益基金</p>
                    </a>
                </li>
            </ul>
            </div>
        </div>
        <!--创建“热门推荐”-->
        <div class="recom">
            <!--左边-->
            <div class="left">
                <div class="title">
                    <h2>热门推荐</h2>
                    <div class="bt">地道特产</div>
                </div>
                <p>成都特产狗屎糖</p>
                <img src="./imgs/partthree-imgs/SpecialMall-imgs/gl.png" alt="">
            </div>
            <!--右边-->
            <div class="right">
                <!--橙子-->
                <div class="org">
                    <div class="instro">
                        <h2>特产水果</h2>
                        <p>汶川水晶橙子</p>
                        <div>立即抢购</div>
                    </div>
                    <img src="./imgs/partthree-imgs/SpecialMall-imgs/cz.png" alt="">
                </div>
                <!--牛肉-->
                <div class="org active">
                    <div class="instro">
                        <h2>畅销热卖</h2>
                        <p>都江堰张飞牛肉</p>
                        <div>立即抢购</div>
                    </div>
                    <img src="./imgs/partthree-imgs/SpecialMall-imgs/nr.png" alt="">
                </div>
            </div>
        </div>
        <!--创建“限时抢购”-->
        <div class="sale">
            <div class="sale-content">
            <!--设置头部-->
            <div class="title">
                <ul class="left">
                    <li class="item">
                        限时抢购
                    </li>
                    <li class="item">
                        <div class="time">

                            <div class="top">
                                04
                            </div>:
                            <div class="center">
                                25
                            </div>:
                            <div class="bot">
                                13
                            </div>
                        </div>
                    </li>
                </ul>
                <ul class="left">
                    <li class="right">
                        <img src="./imgs/partthree-imgs/SpecialMall-imgs/gd.png" alt="">更多抢购
                    </li>

                </ul>
            </div>
                <ul class="list">
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/mht.png" alt="">
                            <p class="word">邛崃猕猴桃</p>
                            <p class="price">
                                ￥9.9
                                <s>￥12.5</s>
                            </p>
                        </a>
                    </li>
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/clz.png" alt="">
                            <p class="word">汶川车厘子</p>
                            <p class="price">
                                ￥13
                                <s>￥28.5</s>
                            </p>
                        </a>
                    </li>
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/cc.png" alt="">
                            <p class="word">成都串串香</p>
                            <p class="price">
                                ￥20
                                <s>￥28.5</s>
                            </p>
                        </a>
                    </li>
                    <li class="item other">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/bc.png" alt="">
                        </a>
                    </li>

                </ul>
                <!--1-->

                <!--2-->

                <!--3-->

                <!--4-->


        </div>
        </div>
        <!--创建“热门线路”-->
        <div class="sale">
            <div class="sale-content">
                <!--设置头部-->
                <div class="title">
                    <ul class="left">
                        <li class="item line">
                            热门线路
                        </li>
                    </ul>
                    <ul class="left">
                        <li class="right">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/gd.png" alt="">更多线路
                        </li>

                    </ul>
                </div>
                <ul class="list">
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/hn.png" alt="">
                            <p class="word">海南三亚5日4晚  </p>
                            <p>跟团游万人...</p>
                            <p class="price">
                                ￥998
                                <span>起</span>
                            </p>
                        </a>
                    </li>
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/tx.png" alt="">
                            <p class="word">桂林山水甲天下简 </p>
                            <p>直不要太漂亮...</p>
                            <p class="price">
                                ￥1200
                                <span>起</span>
                            </p>
                        </a>
                    </li>
                    <li class="item">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/wy.png" alt="">
                            <p class="word">武夷山景点安逸  </p>
                            <p>去摘茶叶...</p>
                            <p class="price">
                                ￥680
                                <span>起</span>
                            </p>
                        </a>
                    </li>
                    <li class="item oth">
                        <a href="#">
                            <img src="./imgs/partthree-imgs/SpecialMall-imgs/jz.png" alt="">
                        </a>
                    </li>

                </ul>
                <!--1-->

                <!--2-->

                <!--3-->

                <!--4-->


            </div>
        </div>
        <!--“精品推荐”列表-->
        <div class="boutique">
            <!--头部文字说明-->
            <div class="title">
                <div class="one">
                    精品推荐
                    <div class="line"></div>
                </div>
                <div class="two">旅游特产</div>
                <div class="three">推荐线路</div>
            </div>
            <!--具体内容-->
            <div class="content">
                <ul class="list">
                    <li class="item">
                        <img class="pic"  src="./imgs/partthree-imgs/SpecialMall-imgs/sc.png" alt="">
                        <p class="instro">四川特产狗食糖果</p>
                        <p class="word">成都特色小吃</p>
                        <div class="price">
                            ￥19.9

                            <img class="add" src="./imgs/partthree-imgs/SpecialMall-imgs/add.png" alt=""></div>
                    </li>
                    <li class="item">
                        <img class="pic"  src="./imgs/partthree-imgs/SpecialMall-imgs/tc.png" alt="">
                        <p class="instro">不晓得哪个地方特产</p>
                        <p class="word"></p>
                        <div class="price">
                            ￥69.9

                            <img class="add" src="./imgs/partthree-imgs/SpecialMall-imgs/add.png" alt=""></div>
                    </li>
                </ul>
                <ul class="list">
                    <li class="item">
                        <img class="pic"  src="./imgs/partthree-imgs/SpecialMall-imgs/mm.png" alt="">
                        <p class="instro">江龙家的馍馍</p>
                        <p class="word">二娃休闲零食</p>
                        <div class="price">
                            ￥32.5

                            <img class="add" src="./imgs/partthree-imgs/SpecialMall-imgs/add.png" alt=""></div>
                    </li>
                    <li class="item">
                        <img class="pic"  src="./imgs/partthree-imgs/SpecialMall-imgs/xhb.png" alt="">
                        <p class="instro">云南特产鲜花饼</p>
                        <p class="word">云南顶级特产</p>
                        <div class="price">
                            ￥45.9

                            <img class="add" src="./imgs/partthree-imgs/SpecialMall-imgs/add.png" alt=""></div>
                    </li>
                </ul>
            </div>
        </div>
    </section>
    <!--创建尾部容器-->
    <footer class="footer">
        <a href="#" class="active">
            <img src="./imgs/partthree-imgs/ActivityNews-imgs/sy.png" alt="">
            <p >首页</p>
        </a>
        <a href="#">
            <img src="./imgs/partthree-imgs/ActivityNews-imgs/gwc.png" alt="">
            <p>购物车</p>
        </a>
        <a href="#">
            <img src="./imgs/partthree-imgs/ActivityNews-imgs/dd.png" alt="">
            <p>订单</p>
        </a>
        <a href="homepage.html">
            <img src="./imgs/partthree-imgs/ActivityNews-imgs/yh.png" alt="">
            <p>我的</p>
        </a>
    </footer>
</div>
</body>
</html>